/* **************************** */
/* BELOW 700 */
/* **************************** */
@media (max-width: 43em) {
  html {
    /* 9px / 16px */
    font-size: 56.2%;
  }
}

/* **************************** */
/* BELOW 618 */
/* **************************** */
@media (max-width: 38em) {
  html {
    /* 7px / 16px */
    font-size: 43.7%;
  }
}

/* **************************** */
/* BELOW 500 */
/* **************************** */
@media (max-width: 31.2em) {
  html {
    /* 6px / 16px */
    font-size: 37.5%;
  }
  .king-icon {
    transform: translate(-50%, -50%) scale(0.8);
  }
  .nav-img {
    transform: translate(-50%, -50%) scale(0.8);
  }
}
/* **************************** */
/* BELOW 400 */
/* **************************** */
@media (max-width: 25em) {
  html {
    /* 5px / 16px */
    font-size: 31.1%;
  }
  .king-icon {
    transform: translate(-50%, -50%) scale(0.6);
  }
  .nav-img {
    transform: translate(-50%, -50%) scale(0.6);
  }
}
/* **************************** */
/* BELOW 350 */
/* **************************** */
@media (max-width: 21.8em) {
  html {
    /* 4px / 16px */
    font-size: 25%;
  }
  .king-icon {
    transform: translate(-50%, -50%) scale(0.5);
  }
  .nav-img {
    transform: translate(-50%, -50%) scale(0.5);
  }
}
/* **************************** */
/* BELOW 300 */
/* **************************** */
@media (max-width: 18.7em) {
  html {
    /* 3px / 16px */
    font-size: 18.7%;
  }
  .king-icon {
    transform: translate(-50%, -50%) scale(0.3);
  }
  .nav-img {
    transform: translate(-50%, -50%) scale(0.3);
  }
  .card-item-left {
    grid-row: 1 / span 2;
    height: 100%;
    background-color: var(--color-car-bac--1);
  }
}
/* **************************** */
/* BELOW 270 */
/* **************************** */
@media (max-width: 16.8em) {
  html {
    /* 3px / 16px */
    font-size: 18.7%;
  }
  .king-icon {
    transform: translate(-50%, -50%) scale(0.3);
  }
  .nav-img {
    transform: translate(-50%, -50%) scale(0.3);
  }
  .card-item-left {
    grid-row: 1 / span 2;
    height: 100%;
    background-color: var(--color-car-bac--1);
  }
  .kings-box {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    row-gap: 4.6rem;
  }
  .carousel-img {
    transform: scale(0.8);
  }
  .card-img--right--1,
  .card-img--right--2 {
    transform: scale(0.8);
  }
}
